home *** CD-ROM | disk | FTP | other *** search
/ Chip 2007 January, February, March & April / Chip-Cover-CD-2007-02.iso / Pakiet internetowy / Przegladarki internetowe / Mozilla Seamonkey 1.0.5 pl / seamonkey-1.0.5.pl-PL.win32.installer.exe / CHATZILLA.XPI / bin / chrome / chatzilla.jar / content / chatzilla / output-base.css < prev    next >
Encoding:
Cascading Style Sheet File  |  2005-07-15  |  18.1 KB  |  614 lines
  1. /* -*- Mode: Text; tab-width: 8; indent-tabs-mode: nil; c-basic-offset: 4 -*-
  2.  * ***** BEGIN LICENSE BLOCK *****
  3.  * Version: MPL 1.1/GPL 2.0/LGPL 2.1
  4.  *
  5.  * The contents of this file are subject to the Mozilla Public License Version
  6.  * 1.1 (the "License"); you may not use this file except in compliance with
  7.  * the License. You may obtain a copy of the License at
  8.  * http://www.mozilla.org/MPL/
  9.  *
  10.  * Software distributed under the License is distributed on an "AS IS" basis,
  11.  * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
  12.  * for the specific language governing rights and limitations under the
  13.  * License.
  14.  *
  15.  * The Original Code is Chatzilla.
  16.  *
  17.  * The Initial Developer of the Original Code is
  18.  * New Dimensions Consulting, Inc.
  19.  * Portions created by the Initial Developer are Copyright (C) 1999
  20.  * the Initial Developer. All Rights Reserved.
  21.  *
  22.  * Contributor(s):
  23.  *   Robert Ginda, rginda@ndcico.com, original author
  24.  *
  25.  * Alternatively, the contents of this file may be used under the terms of
  26.  * either the GNU General Public License Version 2 or later (the "GPL"), or
  27.  * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
  28.  * in which case the provisions of the GPL or the LGPL are applicable instead
  29.  * of those above. If you wish to allow use of your version of this file only
  30.  * under the terms of either the GPL or the LGPL, and not to allow others to
  31.  * use your version of this file under the terms of the MPL, indicate your
  32.  * decision by deleting the provisions above and replace them with the notice
  33.  * and other provisions required by the GPL or the LGPL. If you do not delete
  34.  * the provisions above, a recipient may use your version of this file under
  35.  * the terms of any one of the MPL, the GPL or the LGPL.
  36.  *
  37.  * ***** END LICENSE BLOCK ***** */
  38.  
  39. /* 
  40.  * This file contains the CSS rules for the output window in ChatZilla.
  41.  * The output window is layed out as a table with two columns.  The first
  42.  * column holds a message type or a nickname, depending on what view the
  43.  * message is contained by, and what kind of message it is.  The second column
  44.  * contains the text of the message.  For most message types, ChatZilla displays
  45.  * ascii-art instead of the actual code.  For example, messages of type "JOIN"
  46.  * are displayed as "-->|", and most unclassified message types are displayed
  47.  * as "===".  If you turn on debug messages (using the options->debug messages
  48.  * menuitem) ChatZilla will always show the actual message type.  This can be
  49.  * helpful when styling a particular response from the IRC server.  See the
  50.  * description of the msg-type attribute below.
  51.  *
  52.  * You can modify these styles on your local system by placing your desired
  53.  * styles in a file called chatzilla.css in your <profile>/chrome directory.
  54.  * (the file won't be there already, you have to create it.)  Add the line
  55.  *
  56.  *     @import url(chatzilla.css);
  57.  *
  58.  * to the to your userContent.css (also in your <profile>/chrome directory, and
  59.  * also not there unless you created it already.)  End all CSS rules in your
  60.  * new chatzilla.css with !important to override any styles declared here.
  61.  * For example, on a Linux system, you would create a file called
  62.  * /home/<username>/.mozilla/<username>/chrome/userContent.css (if it
  63.  * doesn't already exist), and add the line @import url(chatzilla.css) to it.
  64.  * Next, create /home/<username>/.mozilla/<username>/chrome/chatzilla.css, and
  65.  * add the text:
  66.  *
  67.  *   .msg {
  68.  *     font-size: 14pt !important;
  69.  *   }
  70.  *
  71.  *   body.chatzilla-body {
  72.  *     background: green !important;
  73.  *   }
  74.  *
  75.  * Close your browser and restart.  When you bring up ChatZilla, it should have
  76.  * a 14pt font and a green background.
  77.  *
  78.  * To learn how to make more useful changes to the ChatZilla output style, read
  79.  * on.
  80.  *
  81.  * All of the output in the message window is contained in an html <TABLE>.
  82.  * New messages are composed of <TR> and <TD> elements inside this <TABLE>.
  83.  * The message table and it's children have the following CSS classes assigned
  84.  * to them:
  85.  *
  86.  *  + .msg-table is used as the class for the surrounding <TABLE>.
  87.  *    Styles applied to this class will affect all parts of all messages.
  88.  *
  89.  *  + .msg-nested-table  is used as the class for the surrounding <TABLE> for
  90.  *     messages sent from users with long nicknames.  A new table is created, and
  91.  *     nested inside a <TR colspan="2"> of the .msg-table.  The rows of this
  92.  *     table have their classes set as if they were direct children of the 
  93.  *     .msg-table.  Placing messages from users with long nicknames in a nested
  94.  *      table keeps the nickname column from getting too wide.
  95.  *
  96.  *  + .msg is used as the class for the surrounding <TR>.  This means that
  97.  *    any styles applied here will affect the entire message.
  98.  *
  99.  *  + .msg-timestamp is used as the class for the <TD> that has all the time
  100.  *    information on it. Styles on this class will affect the time stamps
  101.  *    against messages (but not the format of the time).
  102.  *
  103.  *  + .msg-type is used as the class for the <TD> surrounding the message type
  104.  *    portion of messages.  Styles applied here will only affect message
  105.  *    types.  ie. "-->|", or "[HELP]".
  106.  *
  107.  *  + .msg-user is used as the class for the <TD> surrounding the nickname
  108.  *    portion of messages.  ChatZilla makes use of the :before and :after
  109.  *    pseudoclasses to decorate nicknames with different characters depending
  110.  *    on their message type.  For example, when a user performs a /me, their
  111.  *    nickname may be surrounded by asterisks.
  112.  *
  113.  *  + .msg-data is used as the class for the <TD> surrounding the actual text
  114.  *    of the message.
  115.  *
  116.  * In addition to CSS class properties, portions of a message may have one
  117.  * or mode of the following attributes set:
  118.  *
  119.  *   + view-type is the type of view the message is contained in.  The types
  120.  *     are:
  121.  *          "IRCClient" for the *client* view
  122.  *          "IRCNetwork" for network and server views
  123.  *          "IRCChannel" for channel views
  124.  *          "IRCUser" for query views
  125.  *
  126.  *   + msg-type is the message type described above.  There are too many types
  127.  *     to list here.  Turn on debug messages to force message types to print
  128.  *     in the left column of the output.
  129.  *
  130.  *   + msg-user is the nickname (in lowercase) of the nickname who sent the
  131.  *     message.  If you sent the message, msg-user will be set to "ME!", so
  132.  *     that you can style your messages regardless of your nickname.
  133.  *
  134.  *   + msg-dest is the name of the object that the message is directed to.  It
  135.  *     could be a channel name, or a nickname (both in lowercase.)
  136.  *  
  137.  *   + dest-type is the type of object the message is directed to.  The types
  138.  *     are:
  139.  *          "IRCChannel" for messages sent to a channel.
  140.  *          "IRCUser" for messages sent directly to another user, including
  141.  *           private messages that appear in a network or channel view (when
  142.  *           a dedicated query view does not exist.)
  143.  *
  144.  *   + mark is either the text "even" or "odd".  When the first user speaks on 
  145.  *     a channel, that message is marked as "even".  Messages will continue to
  146.  *     be marked "even" until a different user speaks, when the mark switches
  147.  *     to "odd".  Each view maintains it's own mark state.  An example of how
  148.  *     ChatZilla marks messages would be:
  149.  *
  150.  *            EVEN:   <moe> this deep fat fry-o-later is great.
  151.  *            EVEN:   <moe> It'll deep fat fry a whole buffalo in 30 seconds.
  152.  *             ODD: <homer> but I'm hungry *now*!
  153.  *
  154.  *   + important is either the text "true", or it is not set at all.  If
  155.  *     important is true, then the message triggered ChatZilla /stalk function.
  156.  *     This occurs when someone with a nickname matching a pattern in your
  157.  *     /stalk list speaks, when someone says a word that matches a pattern in
  158.  *     your /stalk list, or when someone says your nickname.
  159.  *
  160.  * 
  161.  */
  162.  
  163. /******************************************************************************
  164.  * basic classes                                                              *
  165.  ******************************************************************************/
  166.  
  167. body.chatzilla-body {               /* The topmost container in the ChatZilla */
  168.     margin: 0px 0px 0px 0px;        /* output window. */
  169. }
  170.  
  171. /* links */
  172. a.chatzilla-link {
  173.     text-decoration: none;
  174.     direction: ltr;
  175.     unicode-bidi: embed;
  176. }
  177.  
  178. /* link hover effect */
  179. a.chatzilla-link:hover {
  180.     text-decoration: underline;
  181. }
  182.  
  183. /* basic styles */
  184. .chatzilla-highlight[name="Large"] {
  185.     font-size: larger;
  186. }
  187.  
  188. .chatzilla-highlight[name="Small"] {
  189.     font-size: smaller;
  190. }
  191.  
  192. .chatzilla-highlight[name="Bold text"],
  193. .chatzilla-bold {
  194.     font-weight: bold;
  195. }
  196.  
  197. .chatzilla-italic {
  198.     font-style: italic;
  199. }
  200.  
  201. .chatzilla-underline {
  202.     text-decoration: underline;
  203. }
  204.  
  205. .chatzilla-strikethrough {
  206.     text-decoration: line-through;
  207. }
  208.  
  209. .chatzilla-teletype {
  210.     font-family: monospace;
  211. }
  212.  
  213. .chatzilla-rheet {
  214.     font-weight: bold;
  215. }
  216.  
  217. /* mirc colors */
  218. .chatzilla-fg00 {
  219.     color: #000000;
  220. }
  221.  
  222. .chatzilla-fg01 {
  223.     color: #c8c8c8;
  224. }
  225.  
  226. .chatzilla-fg02 {
  227.     color: #0000c8;
  228. }
  229.  
  230. .chatzilla-fg03 {
  231.     color: #00c800;
  232. }
  233.  
  234. .chatzilla-fg04 {
  235.     color: #c80000;
  236. }
  237.  
  238. .chatzilla-fg05 {
  239.     color: #c8c800;
  240. }
  241.  
  242. .chatzilla-fg06 {
  243.     color: #c800c8;
  244. }
  245.  
  246. .chatzilla-fg07 {
  247.     color: #ffb000;
  248. }
  249.  
  250. .chatzilla-fg08 {
  251.     color: #ffff00;
  252. }
  253.  
  254. .chatzilla-fg09 {
  255.     color: #00ff00;
  256. }
  257.  
  258. .chatzilla-fg10 {
  259.     color: #00c8c8;
  260. }
  261.  
  262. .chatzilla-fg11 {
  263.     color: #00ffff;
  264. }
  265.  
  266. .chatzilla-fg12 {
  267.     color: #0000ff;
  268. }
  269.  
  270. .chatzilla-fg13 {
  271.     color: #ff00ff;
  272. }
  273.  
  274. .chatzilla-fg14 {
  275.     color: #808080;
  276. }
  277.  
  278. .chatzilla-fg15 {
  279.     color: #989898;
  280. }
  281.  
  282. .chatzilla-bg00 {
  283.     background: #000000;
  284. }
  285.  
  286. .chatzilla-bg01 {
  287.     background: #c8c8c8;
  288. }
  289.  
  290. .chatzilla-bg02 {
  291.     background: #0000c8;
  292. }
  293.  
  294. .chatzilla-bg03 {
  295.     background: #00c800;
  296. }
  297.  
  298. .chatzilla-bg04 {
  299.     background: #c80000;
  300. }
  301.  
  302. .chatzilla-bg05 {
  303.     background: #c8c800;
  304. }
  305.  
  306. .chatzilla-bg06 {
  307.     background: #c800c8;
  308. }
  309.  
  310. .chatzilla-bg07 {
  311.     background: #ffb000;
  312. }
  313.  
  314. .chatzilla-bg08 {
  315.     background: #ffff00;
  316. }
  317.  
  318. .chatzilla-bg09 {
  319.     background: #00ff00;
  320. }
  321.  
  322. .chatzilla-bg10 {
  323.     background: #00c8c8;
  324. }
  325.  
  326. .chatzilla-bg11 {
  327.     background: #00ffff;
  328. }
  329.  
  330. .chatzilla-bg12 {
  331.     background: #0000ff;
  332. }
  333.  
  334. .chatzilla-bg13 {
  335.     background: #ff00ff;
  336. }
  337.  
  338. .chatzilla-bg14 {
  339.     background: #808080;
  340. }
  341.  
  342. .chatzilla-bg15 {
  343.     background: #989898;
  344. }
  345.  
  346. .chatzilla-control-char:before {
  347.     content: "[\\";
  348. }
  349.  
  350. .chatzilla-control-char:after {
  351.     content: "]";
  352. }
  353.  
  354. /* smiley faces */
  355. .chatzilla-emote-txt {              /* emoticon text inside                    */
  356.     display: none;
  357. }
  358.  
  359. .chatzilla-emote:after {            /* empty span to attach :after images to   */
  360.     margin-left: 3px;
  361.     margin-right: 3px;
  362.     content: url(chrome://chatzilla/skin/images/face-question.png);
  363. }
  364.  
  365. .chatzilla-emote[type="face-alien"]:after {
  366.     content: url(chrome://chatzilla/skin/images/face-alien.png);
  367. }
  368.  
  369. .chatzilla-emote[type="face-angry"]:after {
  370.     content: url(chrome://chatzilla/skin/images/face-angry.png);
  371. }
  372.  
  373. .chatzilla-emote[type="face-arrow"]:after {
  374.     content: url(chrome://chatzilla/skin/images/face-arrow.png);
  375. }
  376.  
  377. .chatzilla-emote[type="face-cry"]:after {
  378.     content: url(chrome://chatzilla/skin/images/face-cry.png);
  379. }
  380.  
  381. .chatzilla-emote[type="face-confused"]:after {
  382.     content: url(chrome://chatzilla/skin/images/face-confused.png);
  383. }
  384.  
  385. .chatzilla-emote[type="face-cool"]:after {
  386.     content: url(chrome://chatzilla/skin/images/face-cool.png);
  387. }
  388.  
  389. .chatzilla-emote[type="face-dizzy"]:after {
  390.     content: url(chrome://chatzilla/skin/images/face-dizzy.png);
  391. }
  392.  
  393. .chatzilla-emote[type="face-dizzy-back"]:after {
  394.     content: url(chrome://chatzilla/skin/images/face-dizzy-back.png);
  395. }
  396.  
  397. .chatzilla-emote[type="face-eek"]:after {
  398.     content: url(chrome://chatzilla/skin/images/face-eek.png);
  399. }
  400.  
  401. .chatzilla-emote[type="face-evil"]:after {
  402.     content: url(chrome://chatzilla/skin/images/face-evil.png);
  403. }
  404.  
  405. .chatzilla-emote[type="face-exclaim"]:after {
  406.     content: url(chrome://chatzilla/skin/images/face-exclaim.png);
  407. }
  408.  
  409. .chatzilla-emote[type="face-idea"]:after {
  410.     content: url(chrome://chatzilla/skin/images/face-idea.png);
  411. }
  412.  
  413. .chatzilla-emote[type="face-laugh"]:after {
  414.     content: url(chrome://chatzilla/skin/images/face-laugh.png);
  415. }
  416.  
  417. .chatzilla-emote[type="face-lol"]:after {
  418.     content: url(chrome://chatzilla/skin/images/face-lol.png);
  419. }
  420.  
  421. .chatzilla-emote[type="face-mrgreen"]:after {
  422.     content: url(chrome://chatzilla/skin/images/face-mrgreen.png);
  423. }
  424.  
  425. .chatzilla-emote[type="face-normal"]:after {
  426.     content: url(chrome://chatzilla/skin/images/face-normal.png);
  427. }
  428.  
  429. .chatzilla-emote[type="face-question"]:after {
  430.     content: url(chrome://chatzilla/skin/images/face-question.png);
  431. }
  432.  
  433. .chatzilla-emote[type="face-razz"]:after {
  434.     content: url(chrome://chatzilla/skin/images/face-razz.png);
  435. }
  436.  
  437. .chatzilla-emote[type="face-red"]:after {
  438.     content: url(chrome://chatzilla/skin/images/face-red.png);
  439. }
  440.  
  441. .chatzilla-emote[type="face-rofl"]:after {
  442.     content: url(chrome://chatzilla/skin/images/face-rofl.png);
  443. }
  444.  
  445. .chatzilla-emote[type="face-rolleyes"]:after {
  446.     content: url(chrome://chatzilla/skin/images/face-rolleyes.png);
  447. }
  448.  
  449. .chatzilla-emote[type="face-sad"]:after {
  450.     content: url(chrome://chatzilla/skin/images/face-sad.png);
  451. }
  452.  
  453. .chatzilla-emote[type="face-smile"]:after {
  454.     content: url(chrome://chatzilla/skin/images/face-smile.png);
  455. }
  456.  
  457. .chatzilla-emote[type="face-surprised"]:after {
  458.     content: url(chrome://chatzilla/skin/images/face-surprised.png);
  459. }
  460.  
  461. .chatzilla-emote[type="face-tongue"]:after {
  462.     content: url(chrome://chatzilla/skin/images/face-tongue.png);
  463. }
  464.  
  465. .chatzilla-emote[type="face-wink"]:after {
  466.     content: url(chrome://chatzilla/skin/images/face-wink.png);
  467. }
  468.  
  469. /******************************************************************************
  470.  * message class base definitions                                             *
  471.  ******************************************************************************/
  472.  
  473. .msg-table {                                /* <TABLE> containing all of the  */
  474.     width: 100%;                            /* messages.                      */
  475. }
  476.  
  477. .msg-nested-table {                         /* <TABLE> nested inside          */
  478.     width: 100%;                            /* .msg-table for users with long */
  479.     margin: 0px;                            /* nicknames.                     */
  480.     border: 0px;
  481.     border-spacing: 0px;
  482.     padding: 0px;
  483. }
  484.  
  485. .msg {                                      /* .msg = a single message in the */
  486.     width: 100%;                            /* output window                  */
  487. }
  488.  
  489. .msg-timestamp {                            /* .msg-timestamp = timestamp for */
  490.     font-style: normal !important;          /* the message, done using        */
  491.     vertical-align: top;                    /* :before and content.           */
  492.     white-space: nowrap;
  493. }
  494.  
  495. .msg-type {                                 /* .msg-type = message type       */
  496.     font-variant: small-caps;               /* indicator                      */
  497.     font-size: 90%;
  498.     padding-right: 10px;
  499.     text-align: right;
  500.     vertical-align: top;
  501.     white-space: nowrap;
  502. }
  503.  
  504. .msg-user {                                 /* msg-user = nickname portion of */
  505.     text-align: right;                      /* a message (channel and query   */
  506.     vertical-align: top;                    /* views)                         */
  507. }
  508.  
  509. .msg-data {                                 /* .msg-data = the text portion   */
  510.     padding: 1px 1px 1px 3px;               /* of a message                   */
  511.     width: 100%;
  512.     white-space: -moz-pre-wrap;
  513. }
  514.  
  515.  
  516. /******************************************************************************
  517.  * message class specific definitions                                         *
  518.  ******************************************************************************/
  519.  
  520. /* msg-user is the nickname of the person who spoke, or "ME!" if you said it.
  521.  * msg-type is the type of the message, taken from the irc message.  If you 
  522.  * turn on debug messages (options->debug messages), the msg-types will be
  523.  * displayed to the left of the messages for all messages except:
  524.  * PRIVMSG: when a user sends you, or a channel you are on a message.
  525.  * ACTION: when a user performs a /me.
  526.  * NOTIFY: when a server or user sends you a notification.
  527.  */
  528. .msg[msg-user="|"] .msg-data,                /* messages from common "bulk    */
  529. .msg[msg-user="||"] .msg-data,               /* paste" nicks                  */
  530. .msg[msg-user="|||"] .msg-data,
  531. .msg[msg-user="]"] .msg-data,
  532. .msg[msg-user="["] .msg-data,
  533. .msg[msg-type="372"] .msg-data,              /* MOTD                          */
  534. .msg[msg-type="EVAL-IN"] .msg-data,          /* /eval results                 */
  535. .msg[msg-type="EVAL-OUT"] .msg-data {
  536.     font-size: 90%;
  537.     font-family: monospace;
  538. }
  539.  
  540. .msg[msg-type="USAGE"] .msg-data {
  541.     font-style: italic;
  542. }
  543.  
  544. .msg[msg-type="HELP"] .msg-data {
  545.     font-weight: normal;
  546. }
  547.  
  548. .msg[msg-type="ACTION"] .msg-user {
  549.     font-style: italic;
  550. }
  551.  
  552. .msg[important="true"] .msg-user {
  553.     font-weight: bold;
  554. }
  555.  
  556. /******************************************************************************
  557.  * nickname decorations                                                       *
  558.  ******************************************************************************/
  559.  
  560. /* :before and :after pseudoclasses form the decorations around nicknames */
  561. .msg-user:before {
  562.     content: "<";
  563. }
  564. .msg-user:after {
  565.     content: ">";
  566. }
  567. .msg[important="true"] .msg-user:before {
  568.     font-weight: bold;
  569. }
  570. .msg[important="true"] .msg-user:after {
  571.     font-weight: bold;
  572. }
  573. .msg[msg-user$="ME!"] .msg-user:before {
  574.     content: "<";
  575. }
  576. .msg[msg-user$="ME!"] .msg-user:after {
  577.     content: ">";
  578. }
  579. .msg[msg-type="ACTION"] .msg-user:before,
  580. .msg[msg-type="ACTION"] .msg-user:after {
  581.     content: "";
  582. }
  583. .msg[msg-type="NOTICE"] .msg-user:before {
  584.     content: "[";
  585. }
  586. .msg[msg-type="NOTICE"] .msg-user:after {
  587.     content: "]";
  588. }
  589.  
  590. /* private messages *not* in a query window */
  591. .msg[dest-type="IRCUser"] .msg-user:before {
  592.     content: "to(";
  593. }
  594. .msg[dest-type="IRCUser"][msg-dest$="ME!"] .msg-user:before {
  595.     content: "from(";
  596. }
  597. .msg[dest-type="IRCUser"] .msg-user:after {
  598.     content: ")";
  599. }
  600.  
  601. /* private messages in a query window */
  602. .msg[view-type="IRCUser"] .msg-user:before {
  603.     content: "{";
  604. }
  605. .msg[view-type="IRCUser"] .msg-user:after {
  606.     content: "}";
  607. }
  608. .msg[view-type="IRCUser"][msg-dest$="ME!"] .msg-user:before {
  609.     content: "{";
  610. }
  611. .msg[view-type="IRCUser"][msg-dest$="ME!"] .msg-user:after {
  612.     content: "}";
  613. }
  614.